import { Router } from 'vue-router'
import { useTitleStore } from '../../store/title'
import { getPathTitle } from '../../utils/titleObserver'
import { normalizePath } from '../../utils/pathHelper'

export function createPageTitleGuard(router: Router) {
  router.afterEach((to) => {
    // 获取路由元数据中的标题
    const routeTitle = to.meta?.title as string
    
    if (!routeTitle) return
    
    // 规范化路径
    const path = normalizePath(to.fullPath)
    
    // 检查是否有该路径的缓存标题
    const cachedTitle = getPathTitle(path)
    
    // 优先使用缓存标题，其次是路由标题
    const finalTitle = cachedTitle || routeTitle
    
    // 同步到标题存储，用于其他组件引用
    const titleStore = useTitleStore()
    titleStore.setRawTitle(finalTitle)
    
    // 在下一个微任务中设置document.title，确保路由变化已完全处理
    Promise.resolve().then(() => {
      // 直接设置document.title，这将触发我们的titleObserver
      document.title = finalTitle
    })
  })
} 